<script setup lang="ts">
const props = defineProps<{
  money: number
  msg: string
  modelValue: number
}>()

const emit = defineEmits<{
  (e: 'update:money', money: number): void
  (e: 'update:msg', msg: string): void
  (e: 'update:modelValue', age: number): void
}>()

const changeMoney = () => {
  emit('update:money', props.money + 1)
}
const changeMsg = () => {
  emit('update:msg', '呵呵呵')
}
const changeAge = () => {
  emit('update:modelValue', 21)
}
</script>

<template>
  <div class="child-page">
    <h3>{{ money }} -- {{ msg }} -- {{ modelValue }}</h3>
    <button @click="changeMoney">修改数据1</button>
    <button @click="changeMsg">修改数据2</button>
    <!-- <button @click="$emit('update:modelValue', 21)">修改数据3</button> -->
    <button @click="changeAge">修改数据3</button>
  </div>
</template>

<style lang="scss" scoped></style>
